<template>
	<div class="dept-add">
		<el-dialog :title="title" :visible.sync="dialogVisible" :close-on-click-modal="false" width="600px" @close="$reset('form')">
			<el-form ref="form" :model="form" :rules="rules" label-width="110px">
				<el-form-item label="部门类型">
					<el-radio-group v-model="form.type">
						<el-radio label="1">学院（校区）</el-radio>
						<!-- <el-radio label="2">系（部）</el-radio> -->
						<!-- <el-radio label="3">教研室</el-radio> -->
						<!-- <el-radio label="4">其他</el-radio> -->
					</el-radio-group>
				</el-form-item>
				<el-form-item label="上一级部门" class="top_unit">
					<SelectDept :parentName="parentName" :tableData="tableData" @emit="setDeptData" />
				</el-form-item>
				<el-form-item label="部门名称" prop="name"><el-input v-model="form.name" placeholder="请输入部门名称"></el-input></el-form-item>
				<el-form-item label="部门编码" prop="code"><el-input v-model="form.code"></el-input></el-form-item>
				<el-form-item label="排序">
					<el-input-number v-model="form.sort" :min="1" :max="1000" size="medium" label="排序"></el-input-number>
				</el-form-item>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button @click="dialogVisible = false">取 消</el-button>
				<el-button type="primary" v-preventReClick @click="submitForm('form')">提 交</el-button>
			</div>
		</el-dialog>
	</div>
</template>
<script>
import { compact } from 'lodash';
export default {
	components: {
		SelectDept: () => import('./SelectDept.vue')
	},
	data() {
		return {
			title: '新增',
			dialogVisible: false,
			parentName: '',
			form: {
				pid: 0,
				type: '1',
				name: '',
				code: '',
				sort: 10,
				genre: ''
			},
			rules: {
				name: [{ required: true, message: '请输入部门名称', trigger: 'blur' }],
				code: [{ required: true, message: '请输入部门编码', trigger: 'blur' }]
			}
		};
	},
	props: ['tableData'],
	mounted() {
		this.$bus.$on('showDialogDeptAdd', this.init);
	},
	beforeDestroy() {
		this.$bus.$off('showDialogDeptAdd');
	},
	methods: {
		init(row, type) {
			//0:新增顶级 1:新增子部门 2:编辑
			let size = compact([row, type]).length;
			if (size == 2) {
				this.form = { ...this.form, ...row };
				this.$set(this.form, 'id', row.id);
				let { name, deptFullnamepath } = row;
				let nameArr = compact(deptFullnamepath.split('/'));
				let idx = nameArr.indexOf(name);
				this.parentName = nameArr[idx - 1];
			} else {
				this.form = this.$options.data().form;
				this.$delete(this.form, 'id');
				let { id, name } = row || {};
				this.form.pid = id || 0;
				this.parentName = name || '';
			}
			this.title = size == 2 ? '编辑' : '新增';
			this.dialogVisible = true;
		},
		submitForm(form) {
			this.$refs[form].validate(async valid => {
				if (valid) {
					let dispatchType = this.title == '新增' ? 'addTbDept' : 'updateTbDept';
					await this.$store.dispatch(dispatchType, this.form);
					this.done();
				}
			});
		},
		done() {
			this.dialogVisible = false;
			this.$bus.$emit('refreshDeptList');
			this.$message({
				message: '操作成功',
				type: 'success'
			});
		},
		setDeptData(row) {
			let { id, genre } = row;
			this.form.pid = id || 0;
			this.form.genre = genre || '';
		}
	}
};
</script>
